<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<link href="../css/bk.css" rel="stylesheet" type="text/css" />
<link href="../css/boke_main.css" rel="stylesheet" type="text/css" />
<link href="../css/liuyanban.css" rel="stylesheet" type="text/css" />
<link href="../js/mf-pattern/mF_YSlider.css" rel="stylesheet" type="text/css" />
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.js"></script>
<script type="text/javascript" src="../js/bk.js"></script>
<script type="text/javascript" src="../js/liuyanbana123.js"></script>
<script type="text/javascript" src="../js/myfocus-2.0.1.min.js"></script>
<script type="text/javascript" src="../js/mf-pattern/mF_YSlider.js"></script>
</head>
<body id="bod">
<div class="top" >
    	<div class="top_logo"></div>
        <div class="top_tt"></div>
</div><!--头部区结束-->
<div class="top_nav">
    <ul id="top_bar">
   	 <li><a href="zhuye.html">&nbsp;&nbsp;首页</a></li>
   	 <li><a href="dengtang+fache.html">云程发轫</a></li>
     <li><a href="dengtang+fache.html">登门入室</a></li>
     <li><a href="qingniaoyinqin.html">青鸟殷勤</a></li>
     <li><a href="xianyansuiyu.html">闲言赘语</a></li>
     <li><a href="sihaijielin.html">四海皆邻</a></li>
    </ul>
</div>
<!--头部导航区结束-->
<div class="mianbaoxie">
     &nbsp;&nbsp;&nbsp;
    <a href="zhuye.html"><h2>首页</h2></a>&nbsp;&gt;&gt;
    <a href="#"><h2>留言板</h2></a>
</div>
<div class="mid">
<div class="article">
	<div class="liuyanban">
    <form id="liuyanban">
    	<div class="liuyanban_view">
        	<div id="iM">
            	<span id="topPhoto"></span>
            	<p><b id="topName">XXX</b>&nbsp;&nbsp;&nbsp;<strong>正在发表评论</strong></p>
                <a id="xiashi2" href="javascript:void(0)">更换身份</a>
            </div>
        	<textarea id="liuYan" ></textarea>
            <input id="pinglunanniu" type="button" value="评论提交"/>
        </div>
        <div class="iMessage" id="iMessage">
        	<div id="iMleft"><span><b>填写您的信息：</b></span></div>
            <div id="iMRight">
            	<li id="touxiangxuanze"><!--头像选择-->
                	<div id="kexuantouxiang"></div>
                	<ul id="xuanzetouxiang">
                    	<li style="background-image:url(../image/img/5a.jpg);"></li>
                        <li style="background-image:url(../image/img/2a.jpg);"></li>
                        <li style="background-image:url(../image/img/3a.jpg);"></li>
                        <li style="background-image:url(../image/img/4a.jpg);"></li>
                    </ul>
                </li><p></p>
            	<li><input name="xingming" id="xingming" type="text" placeholder="nihao"><span>姓名(必填)</span></li><p id="xingming1"></p>
                <li><input name="iSex" id="iSex" type="text" placeholder="boy or girl"><span>性别(必填)</span></li><p  id="iSex1"></p>
                <li><input name="youxiang" id="youxiang" type="text" placeholder="youxiangshi"><span>邮箱(可选)</span></li>
                <p id="iYouXiang"></p>
                <input id="querenanniu" type="button" value="确认提交">
            </div>
        </div>
   </form>
    </div>
    <!--留言板结束-->
    <div class="pinglun">
    	<ul id="pinglunqu">
            <li>
              <div class="pingLunPhoto" style="background-image:url(../image/img/2a.jpg);background-size:cover;"></div>
              <div class="pingLunquRight">
              		<div class="PLxingMing">张三</div>
               		<div class="pingLunText">我是张三,我的存在就是为了ajax</div> 
                    <div class="pingLunLow">
                    	<span >时间：2016-12-14</span>
                        <a href="javascript:void(0)">回复</a>
                    </div>
               </div>
            </li>
            <li>
              <div class="pingLunPhoto" style="background-image:url(../image/img/4a.jpg);background-size:cover;"></div>
              <div class="pingLunquRight">
              		<div class="PLxingMing">李四</div>
               		<div class="pingLunText">我是李四,我和张三一样</div> 
                    <div class="pingLunLow">
                    	<span >时间：2016-12-13</span>
                        <a href="javascript:void(0)">回复</a>
                    </div>
               </div>
            </li>
            <li>
              <div class="pingLunPhoto" style="background-image:url(../image/img/3a.jpg);background-size:cover;"></div>
              <div class="pingLunquRight">
              		<div class="PLxingMing">王五</div>
               		<div class="pingLunText">王五,人生已经如此不幸运，还要测试ajax</div> 
                    <div class="pingLunLow">
                    	<span>时间：2016-12-10</span>
                        <a href="javascript:void(0)">我</a>
                    </div>
               </div>
            </li>
            <li id="Display">
              <div class="pingLunPhoto"></div>
              <div class="pingLunquRight">
              		<div class="PLxingMing"></div>
               		<div class="pingLunText"></div> 
                    <div class="pingLunLow">
                    	<span>时间：</span>
                        <a href="javascript:void(0)">你</a>
                    </div>
               </div>
            </li>
        </ul>
    </div>  
</div>
<p>&nbsp;</p>
<div class="aside">
	
	<div class="aside_guanzhu">
    	<p>关注：<p>
        <ul class="guanzhu">
        	<li><img src="../image/20.jpg"><p>腾讯微博</p></li>
            <li><img src="../image/21.jpg"><p>腾讯微博</p></li>
            <li><img src="../image/22.jpg"><p>腾讯微博</p></li>
            <li><img src="../image/23.jpg"><p>腾讯微博</p></li>
        </ul>
    </div>
    <div class="aside_biaoqianyun">
    	<p>标签云：</p>
        <ul>
          <li class="biaoqian_a">css</li>
          <li class="biaoqian_b">html</li>
          <li class="biaoqian_c">js</li>
          <li class="biaoqian_d">html5+css</li>
          <li class="biaoqian_e">慕课网</li>
		  <li class="biaoqian_f">百度</li>
		  <li class="biaoqian_g">豆瓣</li>
		  <li class="biaoqian_h">html5</li>
        </ul>
    </div>
    <div class="aside_liuyanban">
    	<p>留言板:</p>
        <ul id="fangkeliuyan">
        	<li>
            	<span id="numName"></span>
            	<div id="numText"></div>
            </li>
            <li>
            	<span id="num1Name"></span>
            	<div id="num1Text"></div>
            </li>
            <li>
            	<span id="num2Name"></span>
            	<div id="num2Text"></div>
            </li>
        </ul>
        
    </div>
</div>
</div>
<script type="text/javascript">
	a();
	touxiang();	
	xinxitijiao();
	xianshi();
	get();
/*post请求,问题在一个确认按钮一个评论按钮*/
	$("#querenanniu").click(function(){ 
		$.ajax({ 
		    type: "POST", 	
			url: "http://localhost/ajaxDemo/web/php/liuyanban.php",
			data: {
				name:$("#xingming").val(), 
				sex:$("#iSex").val(), 
			},
			dataType: "json",
			success: function(data){
				if (data.success) { 
					pingluntijiao();
				} else {
					alert("出现错误：" + data.msg);
				}  
			},
			error: function(jqXHR){     
			   alert("发生错误：" + jqXHR.status);  
			},     
		});
	});

</script>
<!--中间区完成-->
<div class="low"></div><!--底部区-->
</body>
</html>
